<template>
  <el-dialog
    append-to-body
    :close-on-click-modal="false"
    :before-close="crud.cancelCU"
    :visible="crud.status.cu > 0"
    :title="crud.status.title"
    width="900px"
    destroy-on-close
  >
    <el-form
      label-width="100px"
      size="small"
      ref="form"
      :model="form"
      :rules="rules"
      :inline="true"
    >
      <el-form-item label="拆分药房：" prop="contentName">
          <div style="width:200px;">
               <span>{{this.storeNames}}</span>
           </div>
      </el-form-item>
      <el-form-item label="药品查询：" label-width="120px"  prop="planTime">
           <el-input v-model="cfDrugName"  style="width:200px;">
               <el-button slot="append" icon="el-icon-search" @click="selectDrug(1)"></el-button>
           </el-input>
      </el-form-item>

      <el-form-item label="流转药房：" prop="content">
        <el-select
          v-model="lzStoreId"
          clearable
          size="small"
          placeholder="药房"
          class="filter-item"
          style="width: 200px"
          @change="dStroeChange"
        >
          <template v-for="item in scoreList">
                <el-option :key="item.value" :label="item.label" :value="item.value"></el-option>
              </template>
        </el-select>
      </el-form-item>
      <el-form-item label="药品查询：" label-width="120px"  prop="planTime">
           <el-input v-model="lzDrugName"  style="width:200px;">
               <el-button slot="append" icon="el-icon-search" @click="selectDrug(2)"></el-button>
           </el-input>
      </el-form-item>
      
      
      <!-- <el-form-item label="药房" prop="pharmacyId">
        <el-input v-model="form.pharmacyId"/>
      </el-form-item> -->
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="text" @click="crud.cancelCU">取消</el-button>
      <el-button :loading="crud.procesLoading" type="primary" @click="sumbitData">确认</el-button>
    </div>

    <el-dialog append-to-body
    :close-on-click-modal="false"
    :visible.sync="showDrug"
    :show-close="false"
    destroy-on-close
    title="药品查询"
    width="600px">
    <div style="margin-top: 1px;">
      <el-input placeholder="请输入药品内容" v-model="dName">
      <el-button slot="append" icon="el-icon-search" @click="getDrugData"></el-button>
     </el-input>
     </div>
     <div>
    <el-table
      ref="singleTable"
      :data="tableData"
      highlight-current-row
     @current-change="handleCurrentChange"
      style="width: 100%">
      
      <el-table-column  label="" prop="drugName" ></el-table-column>
      <el-table-column  label="" align="right">
          <template slot-scope="scope">
        <el-button
          size="mini"
          type="text"
          @click="handleEdit(scope.$index, scope.row)">选择</el-button>
      </template>
      </el-table-column>
      </el-table>
      <!-- <pagination /> -->
      <div style="margin-top:15px;">
          <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChanges"
      :current-page="currentPage"
      :page-sizes="[10, 20, 30, 50]"
      :page-size="pageSize"
      layout="sizes, prev, pager, next"
      :total="totalCount">
    </el-pagination>
      </div>
     </div>
    <div slot="footer" class="dialog-footer">
      <!-- <el-button type="text" @click="showDrug = false">取消</el-button> -->
      <el-button  type="primary" @click="showDrug = false">取消</el-button>
    </div>
    </el-dialog>
    
  </el-dialog>
  
</template>

<script>
import CRUD, { form } from '@crud/crud';
import pagination from "@crud/Pagination";
import {queryStore,addDrug,getDrugs} from "@/api/roam/roam";
const defaultForm = {
  content: null,
  responsibleUserName: null,
  planTime: null,
  contentName: null,
  status:1,
}

export default {
  name: "roamForm",
  components: {pagination},
  mixins: [ form(defaultForm) ],
  props: {
    pharmacyId: {
      type: String | Number,
      required: true
    },
    storeNames: {
      type: String,
      required: true
    },
    userNames: {
      type: String,
      required: true
    }
  },
  data() {
    return {
        statusList: [
        {id: 1, text: "未完成"},
        {id: 2, text: "已完成"},
        {id: 3, text: "已取消"}
      ],
      rules: {
        contentName: [
          { required: false, message: '请输入待办事项名称', trigger: 'blur' }
        ],
        content: [
          { required: false, message: '请输入待办事项内容', trigger: 'blur' }
        ]
      },
      showDrug:false,
      drugSelect:null,
      drugName:'',
      drugFlage:1,
      tableData:[],
      scoreList:[],
      lzStoreId:null,
      lzDrugName:'',
      cfDrugName:'',
      dName:'',
      dStoreId:'',
      cfStoreId:'',
      currentPage:1,
      pageSize:10,
      totalCount:0,
      durgSelectFlage:1,
      fromDrugId:null,
      fromDrugName:null,
      fromStoreId:null,
      fromStoreName:null,
      statuss:0,
      toDrugId:null,
      toDrugName:null,
      toStoreId:null,
      toStoreName:null,
    }
  },

  methods: {
    [CRUD.HOOK.beforeToCU]() {
      this.$store.dispatch("GetInfo").then(res => {
      this.form.createUserId = res.pharmacyId;
      this.cfStoreId = res.pharmacyId;
    });
    this.lzStoreId = null;
    this.cfDrugName = '';
    this.lzDrugName = '';
    this.scoreList = [];
    queryStore(this.userNames).then(res => {
        
        res.forEach(store => {
          if(store.storeId == this.cfStoreId){
             this.scoreList.push({
            value: store.cptStoreId,
            label: store.cptStoreName
          });
          }else{
            this.scoreList.push({
            value: store.storeId,
            label: store.storeName
          });
          }
          
        });
        
      }).catch(() => {
      });
      
    },
    handleSizeChange(val){
        console.log(val);
        this.pageSize = val;
        this.getDrugData();
    
    },
    handleCurrentChanges(val) {
       this.currentPage = val;
       this.getDrugData();
      },
    handleEdit(index, row) {
        this.showDrug = false;
        console.log(this.durgSelectFlage);
        console.log(index, row);
        if(this.durgSelectFlage == 1){
            this.fromDrugId = row.id;
            this.fromDrugName = row.drugName;
            this.cfDrugName = row.drugName;
        }else{
            this.toDrugId = row.id;
            this.toDrugName = row.drugName;
            this.lzDrugName = row.drugName;
        }
      },
    handleCurrentChange(val) {
          console.log(val);
      },
    selectDrug(index){
        this.durgSelectFlage = index;
        if(index == 1){
            this.dName = this.cfDrugName;
            this.dStoreId = this.cfStoreId
        }else{
            this.dName = this.lzDrugName;
            this.dStoreId = this.lzStoreId;
        }
        
         var params = {
            'drugName':this.dName,
            'page':this.currentPage,
            'size':this.pageSize,
            'pharmacyId':this.dStoreId
        };

        getDrugs(params).then(res => {
        this.drugFlage = index;
        this.tableData = res.content;
        this.totalCount = res.totalElements;
        this.drugSelect = null;
        this.showDrug = true;
        
      }).catch(() => {
      });
        
    },
    getDrugData(){
      var params = {
            'drugName':this.dName,
            'page':this.currentPage,
            'size':this.pageSize,
            'pharmacyId':this.dStoreId
        };
        
        getDrugs(params).then(res => {
        this.tableData = res.content;
        this.totalCount = res.totalElements;
        
        
      }).catch(() => {
      });
    },
    dStroeChange(e){
        var sObj = this.scoreList.find((item) => {
        return item.value === e;
      });
      this.toStoreName = sObj.label;
      console.log("e---->",this.toStoreName);
    },
    sumbitData(){
        var params = {
            'fromDrugId':this.fromDrugId,
            'fromDrugName':this.fromDrugName,
            'fromStoreId':this.cfStoreId,
            'fromStoreName':this.storeNames,
            'toDrugId':this.toDrugId,
            'toDrugName':this.toDrugName,
            'toStoreId':this.lzStoreId,
            'toStoreName':this.toStoreName,
            'status':0,
        };
        
        addDrug(params).then(res => {
            this.crud.cancelCU();
        this.crud.toQuery();
        
        
      }).catch(() => {
      });
    },
  }
}
</script>